﻿@Code
    ViewBag.Title = "Crear los grados del año escolar"
    Dim lstAños = CType(ViewBag.ListAnios, IEnumerable(Of SelectListItem))
End Code
@Section JSImport
    @MvcHtmlString.Create(Bundle.JavaScript() _
                                .Add("~/Scripts/jTable-new-grados.js") _
                                .ForceRelease _
                                .Render("~/Scripts/JSPage_AE_CG.js"))
End Section
<script type="text/javascript">
    $(function () {
        var a = $("#lstAnios").val();
        if (a) {
            $("#grados").attr("data-anio", a);
            $("#grados").show();
            $('#tit-anio').text(a);
            Load_Grados();
        } else
            $('#grados').hide();

    });

    //Handler para cuando cambia el ListBox
    $("#lstAnios").live("change", function () {
        var value = $(this).val();
        if (value) {
            $("#grados").attr("data-anio", value);
            $("#grados").show();
            $('#tit-anio').text(value);
            Load_Grados();
        }
    });

    function Load_Grados() {
        var anio = $("#grados").attr("data-anio");
        if (anio)
            $('#tbl-grados').jtable('load', { Anio: anio });
        else
            alert("Lo sentimos, ocurrio un error al intentar recuperar el año para cargar los grados");
    };
</script>

<div id="contenido">
    <h2>Establecer el año escolar para crear los nuevos grados</h2>
    <div class="line-titulo"></div>
    <div class="col-titulos" style="width: auto; text-align:left;">
        Por favor, seleccione el año escolar donde desea crear los nuevos grados: 
        <span style= "margin-left:10px;">@Html.DropDownList("lstAnios", lstAños, "-- Seleccione un año --", New With {.class = "combobox-list"})</span>
    </div>

    <section id="grados" style="margin-top:20px;">
        <h2>Tabla de grados para el Año Escolar <span id="tit-anio"></span></h2>
        <div class="line-titulo"></div>
        <div id="tbl-grados" style="width: 600px; margin: 0 auto;"></div>
    </section>
</div>
